div{
    margin: 5em;
    width: 150px;
    height: 80px;
    text-align: center;
    padding: 2em;
}

.div1 {
    background: 
    linear-gradient( -135deg, transparent 15px, #38a 0) top right, 
    linear-gradient( 135deg, transparent 15px, #38a 0) top left,
    linear-gradient( -45deg, transparent 15px, #38a 0) bottom right, 
    linear-gradient( 45deg, transparent 15px, #38a 0) bottom left;
    background-size: 50% 50%;
    background-repeat: no-repeat;
}

.div2 {
    background: 
    radial-gradient( circle at top right,  transparent 15px, #38a 0) top right, 
    radial-gradient( circle at top left, transparent 15px, #38a 0) top left,
    radial-gradient( circle at bottom right,  transparent 15px, #38a 0) bottom right, 
    radial-gradient( circle at bottom left, transparent 15px, #38a 0) bottom left;
    background-size: 50% 50%;
    background-repeat: no-repeat;
}
.div3{
    background: #58a;
    clip-path: polygon(20px 0, calc(100% - 20px) 0,100% 20px, 
        100% calc(100% - 20px), 
        calc(100% - 20px) 100%,20px 100%, 0 calc(100% - 20px), 0 20px ); 
}